import React from "react";
import {connect} from "dva";
import {Layout, Menu, Icon} from "antd";
import {Link} from "dva/router";
import css from "./setup.css";

function Setup({children, location:{pathname}}) {

  const {Sider} = Layout
  const {SubMenu, Item} = Menu

  return (
    <Layout>
      <Sider width={200} className={css.menu}>
        <Menu mode="inline" defaultSelectedKeys={[pathname.match(/^\/[^?#]*/).toString()]}
              defaultOpenKeys={['sub1']} style={{height: '100%', borderRight: 0}}>
          <SubMenu key="sub1" title={<span><Icon type="user"/>系统管理</span>}>
            <Item key="/setup/user">
              <Link to="/setup/user">用户管理</Link>
            </Item>
            <Item key="/setup/role">
              <Link to="/setup/role">角色管理</Link>
            </Item>
            <Item key="/setup/dep">
              <Link to="/setup/dep">部门管理</Link>
            </Item>
            <Item key="3">option3</Item>
            <Item key="4">option4</Item>
          </SubMenu>
          <SubMenu key="sub2" title={<span><Icon type="laptop"/>subnav 2</span>}>
            <Item key="5">option5</Item>
            <Item key="6">option6</Item>
            <Item key="7">option7</Item>
            <Item key="8">option8</Item>
          </SubMenu>
          <SubMenu key="sub3" title={<span><Icon type="notification"/>subnav 3</span>}>
            <Item key="9">option9</Item>
            <Item key="10">option10</Item>
            <Item key="11">option11</Item>
            <Item key="12">option12</Item>
          </SubMenu>
        </Menu>
      </Sider>
      <Layout className={css.content_wrapper}>
        {children}
      </Layout>
    </Layout>
  );
}

function mapStateToProps() {
  return {};
}

export default connect(mapStateToProps)(Setup);
